<template>
  <!-- 机器人表 -->
  <div class="app-container">
    <div class="app-wrap">
      <search-table ref="table" :table-loading="listLoading" :table-data="robotDataList" @query="getRobotList(true)" @reset="refresh">
        <template v-slot:row>
          <el-form-item label="游戏类型:" label-width="90px">
            <el-select v-model="listQuery.game_id" placeholder="请选择游戏类型" clearable filterable >
              <el-option :label="item.label" :value="item.value" v-for="(item, index) in GAME_TYPE" :key="index"></el-option>
            </el-select>
          </el-form-item> 
        </template>
        <template v-slot:actions>
          <el-button type="primary" v-permission="'robot.add'" size="mini" icon="el-icon-plus" @click="addItem">新增</el-button>
          <el-button type="primary" v-permission="'robotCondition.add'" size="mini" icon="el-icon-plus" @click="addCondition">新增机器人行为</el-button>
          <el-button type="info" size="mini" icon="el-icon-refresh" @click="getRobotList">刷新</el-button>
        </template>
        <template>
          <el-table-column align="center" prop="game_id" label="游戏类型" width="150">
            <template slot-scope="scope">
              <span>{{ gameType(scope.row.game_id) }}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_base_robot_id" label="机器人ID" width="100"/>
          <el-table-column align="center" prop="a_robot_type" label="机器人类型" width="150">
            <template slot-scope="scope">
              <el-tag :type="robotTypeStatus(scope.row.a_robot_type)">{{ robotTypes(scope.row.a_robot_type) }} </el-tag>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_money" label="机器人携带筹码" width="150"/>
          <el-table-column align="center" prop="a_robot_rechargetype" label="机器人充值次数概率" width="200">
            <template slot-scope="scope">
              <div v-for="(item,index) in scope.row.rechargetype" :key="index">
                充值【<span class="colorRed">{{ item.item }}</span>】次【<span class="colorRed">{{ item.num/100 }}%</span>】
              </div>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_vip" label="机器人VIP等级" width="150"/>
          <el-table-column align="center" prop="a_robot_weight" label="机器人被抽中权重" width="150">
            <template slot-scope="scope">
              {{ scope.row.a_robot_weight/100 }}%
            </template>
          </el-table-column>
          <el-table-column align="center" prop="a_robot_remark" label="机器人备注"/>
          <el-table-column align="left" prop="operation" label="操作" width="200" fixed="right">
            <template slot-scope="scope">
              <el-tooltip effect="dark" v-permission="'robotCondition.edit'" content="编辑行为" placement="top-start">
                <el-button size="mini" type="primary" @click.stop="editRobotCondition(scope.row)"><i class="el-icon-s-tools" /></el-button>
              </el-tooltip>
              <el-tooltip effect="dark" v-permission="'robot.edit'" content="编辑" placement="top-start">
                <el-button size="mini" type="warning" @click.stop="editItem(scope.row)"><i class="el-icon-edit-outline" /></el-button>
              </el-tooltip>
              <el-tooltip effect="dark" v-permission="'robot.delete'" content="删除" placement="top-start">
                <el-button size="mini" type="danger" @click.stop="deleteItem(scope.row)"><i class="el-icon-delete" /></el-button>
              </el-tooltip>
            </template>
          </el-table-column>
        </template>
        <template v-slot:footer>
          <pagination  :total="currentTotal" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getRobotList" />
        </template>
      </search-table>
      <condition-details :show="isShowConditionDetails"  :condition="conditionDataList"  :addShow="isAddShowDetails" @onHideDetails="onHideDetails" @onHideAddDetails="onHideAddDetails" :robotType="listQuery.game_id"/>
      <page-details :show="isShowDetails" :data="checkedItem"  :robotTypeData="robotTypeData" @onHideDetails="onHideDetails" :robotType="listQuery.game_id"/>
    </div>
  </div>
</template>

<script>
import { throttle } from "@/utils/index";
import { 
  getRobot,
  delRobot,
  getRobotCondition,
 } from "@/api/game";
import {
  GAME_TYPE
} from '@/utils/enum'
import PageDetails from "./page-details";
import ConditionDetails from "./condition-details";
import SearchTable from "@/components/SearchTable";
export default {
  name: "robot",
  components: {
    PageDetails,
    ConditionDetails,
    SearchTable,
  },
  data () {
    return {
      GAME_TYPE,
      robotDatalist: [],
      conditionDataList: null,
      checkedItem: null,
      listLoading: false,
      isShowConditionDetails: false,
      isShowDetails: false,
      isAddShowDetails: false,
      currentTotal: 0,
      listQuery: {
        page: 1,
        size: 50,
        game_id:1
      },
      robotTypeData: [{
        label:'非杀率机器人',
        value:1,
        type:'info'
      },{
        label:'普通杀率机器人',
        value:2,
        type:'warning'
      },{
        label:'大杀率机器人',
        value:4,
        type:'danger'
      }],
      robotDataList:[]
    };
  },
  created () {
    // this.getRobotList()
  },
  activated () {
    this.getRobotList()
  },
  methods: {
    // 获取机器人表
    async getRobotList (query) {
      let that = this,params=that.listQuery;
      if(query && !query.page){
        params.page=1
        params.size=50
      }
      that.robotDataList = [];
      that.checkedItem = null;
      that.listLoading = true;
      const response = await getRobot(params)
      if (response.code==1) {
        if (response.data.list) {
          response.data.list.forEach((item) => {
            item.isChecked = false;
            item.a_robot_money=that.$public.mathNumberDivideWan(item.a_robot_money)
            item.rechargetype=[]
            if(item.a_robot_rechargetype){
              item.rechargetype=that.strToArr(item.a_robot_rechargetype)
            }
          });
          that.currentTotal = response.data.total;
          that.robotDataList = response.data.list;
        }
      }else{
        that.$message.error(response.msg)
      }
      that.listLoading = false;
    },
    // 编辑行为----获取条件机器人行为
    editRobotCondition (row) {
      let that = this,dataList=[],conditionData=[];
      that.conditionDataList = [];
      getRobotCondition({
        a_base_robot_id: row.a_base_robot_id,
        game_id: that.listQuery.game_id,
      }).then(function (res) {
        if (res.data) {
          for (const key in res.data) {
            dataList.push({id:Number(key),data:res.data[key]})
          }
          dataList.map(item=>{
            for (const key in item.data) {
              conditionData.push({id:Number(item.id),children:JSON.parse(key),childrenSecond:item.data[key]})
            }
          })
          conditionData.map((item,index)=>{
            item.children.children=item.childrenSecond
            delete item.childrenSecond
          })
          that.conditionDataList=conditionData
          that.isShowConditionDetails = true;
        }
      }).catch((error) => {
        that.$message.error(error.msg)
      })
    },
    // 新增
    addItem(){
      let that = this;
      that.checkedItem = null;
      that.isShowDetails = true;
    },
    // 新增条件机器人
    addCondition(){
      let that = this;
      that.conditionDataList = null;
      that.isAddShowDetails = true;
    },
    // 编辑
    editItem (row) {
      let that = this;
      that.checkedItem = row;
      that.isShowDetails = true;
    },
    // 删除
    deleteItem (row) {
      let that = this;
      that.$confirm(`是否删除【${row.a_robot_remark}】(${row.a_base_robot_id})机器人`, "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
      }).then(() => {
          delRobot({
            id: [row.id],
          }).then(function () {
            that.getRobotList();
            that.$message({
              type: "success",
              message: "删除成功!",
            });
          });
        })
        .catch(() => { });
    },
    // 游戏类型展示
    gameType(cellValue){
      return (this.GAME_TYPE.find((item) => item.value === cellValue)?.label || "-");
    },
    // 机器人类型
    robotTypes (cellValue) {
      return (this.robotTypeData.find((item) => item.value === cellValue)?.label || "-");
    },
    // 机器人类型状态
    robotTypeStatus (cellValue) {
      return (this.robotTypeData.find((item) => item.value === cellValue)?.type || "-");
    },
    strToArr (str) {
      // 一组值
      let arr = this.$public.srtToArr(str), arrData = [];
      // 只有一个行为
      if (arr[0] && typeof (arr[0]) == 'string') {
        arrData.push({ item: Number(arr[0]), num: Number(arr[1]) })
      } else {
        // 多个行为
        arr.map(item => {
          arrData.push({ item: Number(item[0]), num: Number(item[1]) })
        })
      }
      return arrData
    },
    // 隐藏详情
    onHideDetails (show) {
      this.isShowDetails = false;
      this.isShowConditionDetails = false;
      this.isAddShowDetails = false;
      if (show) {
        this.getRobotList();
      }
    },
    onHideAddDetails(){
      this.isAddShowDetails = false;
    },
    // 刷新
    refresh: throttle(function () {
      this.listQuery = {
        page: 1,
        size: 50,
        game_id:1
      };
      this.getRobotList("");
    }, 2000),
  },
};
</script>

<style lang="scss" scoped></style>
